<template>
  <div class="gl_py_10">
    <div class="box gl_mx_15 gl_padding_15">
      <div class="au_identify">
        <van-image v-if="peopleData.paperImage" width="137" height="180" :src="getStaticFileUrl(peopleData.paperImage)" />
        <span v-else>证 书</span>
      </div>
      <div class="text_content">
        <p>
          <span class="gl_color_grey">证书编号：</span>
          <span>{{ peopleData.paperNumber ? peopleData.paperNumber : '- -' }}</span>
        </p>
        <p class="gl_my_15">
          <span class="gl_color_grey">证书名称：</span>
          <span>{{ peopleData.paperDesc ? peopleData.paperDesc : '- -' }}</span>
        </p>
        <van-button class="gl_my_15 gl_fs_12" icon="edit" style="width:100%; border-radius: 3px;" type="info" size="small" @click="edit(peopleData)">修改</van-button>
        <van-button class="gl_fs_12" icon="delete" style="width:100%; border-radius: 3px;" type="warning" size="small" @click="remove(peopleData.id)">删除</van-button>
      </div>
    </div>
  </div>
</template>
<script>
import {
  api_DELETE_EventsManagementRegisterTagRegisterTagDetailRegisterTagDetailId
} from '@/extend/api/gameswaggerApi/app.js';

export default {
  name: 'PeopleList',
  props: {
    peopleData: {
      type: Object,
      default() {
        return {
          paperImage: '',
          paperNumber: '',
          paperDesc: ''
        };
      }
    },
    tagId: {
      type: String,
      default: ''
    }
  },
  data() {
    return {};
  },
  methods: {
    // 图片回显
    getStaticFileUrl(relativeUrl) {
      if (!relativeUrl) return '';
      return WEB_CONFIG.VUE_APP_STATIC_FILE_RUL + relativeUrl;
    },
    remove(id) {
      var that = this;
      that.$dialog.confirm({
        message: '您确定要删除此证书吗？'
      }).then(() => {
        api_DELETE_EventsManagementRegisterTagRegisterTagDetailRegisterTagDetailId(id).then(res => {
          that.$notify({ type: 'success', message: '删除成功' });
          that.getRegisterList();
        });
      }).catch(() => {
        that.$notify({ type: 'primary', message: '取消删除' });
      });
    },
    getRegisterList() {
      this.$parent.getRegisterList();
    },
    edit(peopleData) {
      this.$emit('tag', this.tagId);
      this.$emit('edit', peopleData);
    }
  }
};
</script>
<style lang="scss" scoped>
.box {
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.09);
  border-radius: 5px;
  overflow: hidden;
  border: 1px solid #efefef;
}
.box p {
  line-height: 16px;
  font-size: 12px;
  color: #333333;
}
.au_identify{
  text-align: center;
  width: 137px;
  height: 180px;
  border: 1px solid #DCDFE6;
  color: #646566;
  line-height: 180px;
  box-sizing: border-box;
  overflow: hidden;
  display: inline-block;
}
.au_identify .van-field__error-message{
  text-align: center;
}
.text_content {
  width: 160px;
  display: inline-block;
  margin-left: 15px;
  vertical-align: top;
}
</style>
